﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <script src="jquery-1.7.1.min.js" type="text/javascript"></script>
    <script src="knockout-2.1.0.js" type="text/javascript"></script>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
</head>
<body>
    <!--<div>
        You've clicked <span data-bind="text: numberOfClicks"></span>times
    <button data-bind="click: incrementClickCounter">Click me</button>
    </div>

    <script type="text/javascript">
        var viewModel1 = {
            numberOfClicks: ko.observable(0),
            incrementClickCounter: function () {
                var previousCount = this.numberOfClicks();
                this.numberOfClicks(previousCount + 1);
            }
        };
        ko.applyBindings(viewModel1);
    </script>-->


    <div data-bind="css: profitStatus">
        Profit Information
    </div>

    <script type="text/javascript">
        var viewModel = {
            currentProfit: ko.observable(150000)//属性
        };

        // Evalutes to a positive value, so initially we apply the "profitPositive" class
        viewModel.profitStatus = ko.computed(function () {
            if (this.currentProfit() < 0)
                alert("profitWarning");
            else
                alert("profitPositive");
        }, viewModel);

        // Causes the "profitPositive" class to be removed and "profitWarning" class to be added
        viewModel.currentProfit(50);//修改属性的值
        ko.applyBindings(viewModel);
    </script>

</body>
</html>
